<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>葫芦侠</title>

    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/editUserInfo.css">
</head>

<body>



    <!-- 头部 -->
    <header>
        <a href="" class="back">
            <i></i>
            <span>个人信息</span>
        </a>
        <a class="save" href="">保存</a>
    </header>


    <div class="wrap">

        <div class="box-imgs">

            <div class="head">
                图片 2/8
            </div>

            <div class="body">


                <!-- - 图片 -->
                <div class='img'><img src='./imgs/beaute-1.png' alt=''></div>

                <!-- - 图片 -->
                <div class='img'><img src='./imgs/beaute-2.png' alt=''></div>

                <!-- - 图片 -->
                <div class='img'><img src='./imgs/beaute-n.png' alt=''></div>


            </div>

            <div class="foot">
                第一张默认为头像；长按图片可以拖动排序
            </div>



        </div>

        <div class="box-base-info">

            <div class="head">基本信息</div>

            <div class="body">

                <div class="item">

                    <!-- - 左边 -->
                    <div class='left'>昵称</div>

                    <!-- - 右边 -->
                    <div class='right'>
                        <input type="text" value="鸭王大洼">
                    </div>

                </div>

                <div class="item">

                    <!-- - 左边 -->
                    <div class='left'>昵称</div>

                    <!-- - 右边 -->
                    <div class='right'>
                        <span class="con radio">男</span>
                        <span class="radio">女</span>
                    </div>

                </div>

                <div class="item">

                    <!-- - 左边 -->
                    <div class='left'>生日</div>

                    <!-- - 右边 -->
                    <div class='right'>1999-01-01</div>

                </div>

            </div>

        </div>

        <div class="box-person-info">

            <div class="head">个人信息</div>

            <div class="body">

                <div class="title">个性签名</div>

                <div class="content">
                    有没有想说的呢？
                </div>

            </div>

            <div class="foot">

                <div class="item">

                    <!-- - 左边 -->
                    <div class='left'>家乡</div>

                    <!-- - 右边 -->
                    <div class='right'>
                        <input type="text" value="无">
                    </div>

                </div>

                <div class="item">

                    <!-- - 左边 -->
                    <div class='left'>学校</div>

                    <!-- - 右边 -->
                    <div class='right'>
                        <input type="text" value="请填写您的就读学校">
                    </div>

                </div>

            </div>

        </div>

        <div class="box-other-info">

            <div class="head">其他信息</div>

            <div class="body">

                <div class="title">去过的地方</div>

                <div class="content">
                    你去过的地方有哪些？
                </div>

            </div>

            <div class="foot">

                <div class="title">标签</div>

                <div class="content">
                    请选择标签
                </div>

            </div>


        </div>



    </div>





</body>

</html>